<!-- 空调控制面板 -->

<template>
    <div class="kongTiaoControl">
        <div class="leftControl">
            <navigation-bar customTitle="控制面板" style="margin-left: -10px"> </navigation-bar>
            <div class="p50" style="width: 100%; display: flex; height: 42px">
                <div class="control" style="flex-direction: row; width: 100%">
                    <label style="margin-left: 10px">温控方案：</label>
                    <el-select v-model="wkfa" style="flex: 1" size="mini">
                        <el-option
                            v-for="item in options"
                            :value="item.LIST_GUID"
                            :key="item.LIST_GUID"
                            :label="item.SCHE_NAME"
                        ></el-option>
                    </el-select>
                    <el-button type="primary" style="margin: 0" @click="sureChange">确定</el-button>
                    <el-button type="primary" style="margin: 0" @click="detailShow">详情</el-button>

                    <!-- <div style="margin-left: 10px">
                        <label @click="acl = true" style="cursor: pointer; display: flex; line-height: 20px">
                            <img
                                :src="require(`@/assets/images/1021/${acl ? 'xuanzhong' : 'weixuanzhong'}.svg`)"
                                style="cursor: pointer; margin-right: 4px"
                            />按策略运行
                        </label>

                        <span @click="acl = false" style="cursor: pointer; display: flex; line-height: 20px">
                            <img
                                :src="require(`@/assets/images/1021/${!acl ? 'xuanzhong' : 'weixuanzhong'}.svg`)"
                                style="cursor: pointer; margin-right: 4px"
                            />
                            无策略控制
                        </span>
                    </div> -->
                </div>
            </div>
            <div style="display: flex; gap: 10px">
                <div class="p50">
                    <div class="control">
                        <div class="border">
                            <div class="header">
                                <svg
                                    class="icon"
                                    viewBox="0 0 1024 1024"
                                    version="1.1"
                                    xmlns="http://www.w3.org/2000/svg"
                                    p-id="1618"
                                    width="16"
                                    height="16"
                                    xmlns:xlink="http://www.w3.org/1999/xlink"
                                >
                                    <path
                                        d="M844.3 218.9h-172c-9.4 0-17-7.6-17-17s7.6-17 17-17h172c9.4 0 17 7.6 17 17s-7.6 17-17 17zM844.3 474.9h-172c-9.4 0-17-7.6-17-17s7.6-17 17-17h172c9.4 0 17 7.6 17 17s-7.6 17-17 17zM758.3 346.9h-86c-9.4 0-17-7.6-17-17s7.6-17 17-17h86c9.4 0 17 7.6 17 17s-7.6 17-17 17zM411.4 997.4c-2.7 0-5.4 0-8.1-0.1-65.3-2-127-28.4-173.9-74.4-46.8-46-74.3-107.3-77.4-172.5-2-42.6 6-83.6 23.8-121.8 15.7-33.8 39-64.3 67.5-88.5V204.8c0-92.6 75.3-167.9 167.9-167.9h0.2c92.6 0 167.9 75.3 167.9 167.9V540c58.3 49.5 91.5 121.1 91.5 197.8 0 35.7-7.1 70.3-21.2 102.9-13.6 31.4-33 59.5-57.6 83.4-24.6 23.9-53.2 42.4-85 55-30.5 12.2-62.6 18.3-95.6 18.3z m-0.2-926.5c-73.8 0-133.9 60.1-133.9 133.9v351.5l-6.4 5.1c-27.3 21.8-49.5 50-64.2 81.5-15.4 33.2-22.4 68.8-20.7 105.9 2.7 56.6 26.5 109.9 67.2 149.9s94.3 62.9 151 64.7c2.3 0.1 4.7 0.1 7 0.1 59 0 114.5-22.5 157-63.7 44.2-42.9 68.5-100.3 68.5-161.9 0-69.1-31-133.4-85.1-176.5l-6.4-5.1V204.8c0-73.8-60.1-133.9-133.9-133.9h-0.1z"
                                        fill="#409eff"
                                        p-id="1619"
                                    ></path>
                                    <path
                                        d="M410.3 870.9c-74.4 0-135-60.6-135-135s60.6-135 135-135 135 60.6 135 135-60.6 135-135 135z m0-236c-55.7 0-101 45.3-101 101s45.3 101 101 101 101-45.3 101-101-45.3-101-101-101z"
                                        fill="#409eff"
                                        p-id="1620"
                                    ></path>
                                    <path
                                        d="M410.3 634.9c-9.4 0-17-7.6-17-17v-312c0-9.4 7.6-17 17-17s17 7.6 17 17v312c0 9.4-7.6 17-17 17z"
                                        fill="#409eff"
                                        p-id="1621"
                                    ></path>
                                </svg>
                                温度
                            </div>
                            <div class="body">
                                <div style="height: 32px; font-size: 30px; color: #409eff">
                                    <!-- <img src="@/assets/images/airIndex/5.png" />
                                    28% -->

                                    <div class="wdControl" @click="reduce()">
                                        <img src="@/assets/images/1021/reduce.svg" />
                                    </div>
                                    <div class="wdControl">
                                        <!-- <label>{{ defaultValue }}℃</label> -->
                                        <label>{{ ktDetail.设定温度 }}℃</label>
                                    </div>
                                    <div class="wdControl" @click="plus()">
                                        <img src="@/assets/images/1021/add.svg" />
                                    </div>
                                </div>

                                <!-- <div style="margin-top: 17px; height: 32px">
                                    <el-select
                                        v-model="curTemp"
                                        style="width: 80px; margin-right: 10px"
                                        @change="
                                            (e) => {
                                                changeTemp(e)
                                            }
                                        "
                                    >
                                        <el-option
                                            :label="select + '℃'"
                                            :value="select"
                                            v-for="select in tempList"
                                            :key="select"
                                        ></el-option>
                                    </el-select>
                                    <el-button type="primary">确定</el-button> -->
                                <!-- </div> -->
                            </div>
                        </div>

                        <div class="border">
                            <div class="header">
                                <svg
                                    t="1752943124053"
                                    class="icon"
                                    viewBox="0 0 1024 1024"
                                    version="1.1"
                                    xmlns="http://www.w3.org/2000/svg"
                                    p-id="10308"
                                    width="16"
                                    height="16"
                                    xmlns:xlink="http://www.w3.org/1999/xlink"
                                >
                                    <path
                                        d="M875 85H149c-47.1 0-85.4 38.3-85.4 85.4v298.9c0 47.1 38.3 85.4 85.4 85.4h726c47.1 0 85.4-38.3 85.4-85.4V170.4C960.4 123.3 922 85 875 85z m-0.2 384.3H149V170.4h726l-0.2 298.9z"
                                        p-id="10309"
                                        fill="#409eff"
                                    ></path>
                                    <path
                                        d="M405.2 341.2h213.5v85.4H405.2z m256.3 0h85.4v85.4h-85.4zM392.7 609.9c-16.7-16.7-43.7-16.7-60.4 0-5.7 5.7-55.2 58.1-55.2 158.3 0 63.6 20.8 93.1 34.6 112.6 7.8 11 8.1 12.1 8.1 15.5 0 23.6 19.1 42.7 42.7 42.7s42.7-19.1 42.7-42.7c0-31.3-13.7-50.7-23.7-64.8-10.2-14.4-19-26.8-19-63.3 0-63.9 28.6-96.1 30.6-98.3 16.3-16.7 16.2-43.5-0.4-60z m149.5 0c-16.7-16.7-43.7-16.7-60.4 0-5.7 5.7-55.2 58.1-55.2 158.3 0 63.6 20.8 93.1 34.6 112.6 7.8 11 8.1 12.1 8.1 15.5 0 23.6 19.1 42.7 42.7 42.7s42.7-19.1 42.7-42.7c0-31.3-13.7-50.7-23.7-64.8-10.2-14.4-19-26.8-19-63.3 0-63.9 28.6-96.1 30.6-98.3 16.3-16.7 16.1-43.5-0.4-60z m149.4 0c-16.7-16.7-43.7-16.7-60.4 0-5.7 5.7-55.2 58.1-55.2 158.3 0 63.6 20.8 93.1 34.6 112.6 7.8 11 8.1 12.1 8.1 15.5 0 23.6 19.1 42.7 42.7 42.7s42.7-19.1 42.7-42.7c0-31.3-13.7-50.7-23.7-64.8-10.2-14.4-19-26.8-19-63.3 0-63.9 28.6-96.1 30.6-98.3 16.3-16.7 16.2-43.5-0.4-60z"
                                        p-id="10310"
                                        fill="#409eff"
                                    ></path>
                                </svg>
                                风向
                            </div>
                            <div class="body">
                                <div class="bodyBorder">
                                    <div :class="airDic == 0 ? 'item btnHover' : 'item'" @click="airDicChange(0)">
                                        <img src="@/assets/images/newIndex/new/ktdx1.1.png" v-if="airDic == 0" />
                                        <img src="@/assets/images/newIndex/new/ktdx1.png" v-if="airDic != 0" />
                                        <label>定向</label>
                                    </div>
                                    <div :class="airDic == 1 ? 'item btnHover' : 'item'" @click="airDicChange(1)">
                                        <img src="@/assets/images/newIndex/new/sf1.1.png" v-if="airDic == 1" />
                                        <img src="@/assets/images/newIndex/new/sf1.png" v-if="airDic != 1" />
                                        <label>扫风</label>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="p50">
                    <div class="control">
                        <div class="border">
                            <div class="header">
                                <svg
                                    t="1752943018400"
                                    class="icon"
                                    viewBox="0 0 1024 1024"
                                    version="1.1"
                                    xmlns="http://www.w3.org/2000/svg"
                                    p-id="2871"
                                    width="16"
                                    height="16"
                                    xmlns:xlink="http://www.w3.org/1999/xlink"
                                >
                                    <path
                                        d="M390.4 480H217.6A89.696 89.696 0 0 1 128 390.4V217.6C128 168.192 168.192 128 217.6 128h172.8c49.408 0 89.6 40.192 89.6 89.6v172.8c0 49.408-40.192 89.6-89.6 89.6zM217.6 192c-14.112 0-25.6 11.488-25.6 25.6v172.8c0 14.112 11.488 25.6 25.6 25.6h172.8c14.112 0 25.6-11.488 25.6-25.6V217.6c0-14.112-11.488-25.6-25.6-25.6H217.6zM806.4 480H633.6a89.696 89.696 0 0 1-89.6-89.6V217.6c0-49.408 40.192-89.6 89.6-89.6h172.8c49.408 0 89.6 40.192 89.6 89.6v172.8c0 49.408-40.192 89.6-89.6 89.6zM633.6 192c-14.112 0-25.6 11.488-25.6 25.6v172.8c0 14.112 11.488 25.6 25.6 25.6h172.8c14.112 0 25.6-11.488 25.6-25.6V217.6c0-14.112-11.488-25.6-25.6-25.6H633.6zM390.4 896H217.6A89.696 89.696 0 0 1 128 806.4V633.6c0-49.408 40.192-89.6 89.6-89.6h172.8c49.408 0 89.6 40.192 89.6 89.6v172.8c0 49.408-40.192 89.6-89.6 89.6zM217.6 608c-14.112 0-25.6 11.488-25.6 25.6v172.8c0 14.112 11.488 25.6 25.6 25.6h172.8c14.112 0 25.6-11.488 25.6-25.6V633.6c0-14.112-11.488-25.6-25.6-25.6H217.6zM720 896c-97.04 0-176-78.96-176-176s78.96-176 176-176 176 78.96 176 176-78.96 176-176 176z m0-288c-61.744 0-112 50.256-112 112s50.256 112 112 112 112-50.256 112-112-50.256-112-112-112z"
                                        fill="#409eff"
                                        p-id="2872"
                                    ></path>
                                </svg>
                                模式
                            </div>
                            <div class="body">
                                <div class="bodyBorder">
                                    <!-- 0：自动；1，制冷；2，除湿；3，送风；4，制热 -->

                                    <div :class="mode == 0 ? 'item btnHover' : 'item'" @click="modeChange(0)">
                                        <img src="@/assets/images/newIndex/new/4.1.png" v-if="mode == 0" />
                                        <img src="@/assets/images/newIndex/new/4.png" v-if="mode != 0" />
                                        <label>自动</label>
                                    </div>
                                    <div :class="mode == 1 ? 'item btnHover' : 'item'" @click="modeChange(1)">
                                        <img src="@/assets/images/newIndex/new/5.1.png" v-if="mode != 1" />
                                        <img src="@/assets/images/newIndex/new/5.png" v-if="mode == 1" />
                                        <label>制冷</label>
                                    </div>
                                    <div :class="mode == 4 ? 'item btnHover' : 'item'" @click="modeChange(4)">
                                        <img src="@/assets/images/newIndex/new/6.png" v-if="mode != 4" />
                                        <img src="@/assets/images/newIndex/new/6.1.png" v-if="mode == 4" />
                                        <label>制热</label>
                                    </div>
                                    <div :class="mode == 2 ? 'item btnHover' : 'item'" @click="modeChange(2)">
                                        <img src="@/assets/images/1021/chushi.svg" v-if="mode != 2" />
                                        <img src="@/assets/images/1021/chushi2.svg" v-if="mode == 2" />
                                        <label>除湿</label>
                                    </div>
                                    <div :class="mode == 3 ? 'item btnHover' : 'item'" @click="modeChange(3)">
                                        <img src="@/assets/images/newIndex/new/tf1.png" v-if="mode != 3" />
                                        <img src="@/assets/images/newIndex/new/tf1.1.png" v-if="mode == 3" />
                                        <label>通风</label>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="border">
                            <div class="header">
                                <svg
                                    t="1752943039623"
                                    class="icon"
                                    viewBox="0 0 1024 1024"
                                    version="1.1"
                                    xmlns="http://www.w3.org/2000/svg"
                                    p-id="3977"
                                    width="16"
                                    height="16"
                                    xmlns:xlink="http://www.w3.org/1999/xlink"
                                >
                                    <path
                                        d="M174.5 394.1h331.2c91 0 166-73.2 166.3-164.2 0.3-91-73.7-165.1-164.7-165.1-43.2 0-84 16.6-114.9 46.7-15.5 15.1-27.7 32.9-36.2 52.2-12.7 29.1 8.4 61.7 40.1 62.6 18.5 0.5 35.2-10.4 42.6-27.3 11.6-26.2 37.7-44.2 68.3-44.2 41.4 0 75.1 33.9 74.7 75.4-0.4 41.1-34.5 73.9-75.6 73.9H174.5c-24.9 0-45 20.1-45 45s20.2 45 45 45zM189.3 634.2l0.6 45-0.6-45zM682 626.9c-0.6 0-0.8 0-427.3 6.3-7.3 0.1-14.2 0.2-20.5 0.3-24.8 0.4-44.7 20.8-44.3 45.6 0.3 24.9 20.8 44.8 45.7 44.4 6.3-0.1 13.2-0.2 20.5-0.3 124.9-1.9 415.3-6.2 426.2-6.3 42.8 0.2 77.2 36.5 74.2 80-2.8 39.8-35.9 70-75.7 69.3-30.2-0.5-55.9-18.5-67.2-44.5-7.3-16.8-24.1-27.5-42.5-27-31.7 0.9-52.8 33.5-40.1 62.6 8.4 19.4 20.6 37.1 36.2 52.2 30.9 30.1 71.8 46.7 115 46.7 91.8-0.1 166.8-77 164.5-168.8-2.3-88.9-75.3-160.5-164.7-160.5z"
                                        p-id="3978"
                                        fill="#409eff"
                                    ></path>
                                    <path
                                        d="M856.6 240.3c-29-11.5-60.5 10.1-60.5 41.4v1.3c0 18 10.9 34.4 27.6 41.1 27.5 11 47 38 47 69.4 0 41.2-33.5 74.7-74.7 74.7H112.6c-24.9 0-45 20.1-45 45s20.1 45 45 45h683.5c90.8 0 164.7-73.9 164.7-164.7-0.1-69.5-43.3-129-104.2-153.2z"
                                        p-id="3979"
                                        fill="#409eff"
                                    ></path>
                                </svg>
                                风速
                            </div>
                            <div class="body">
                                <div class="bodyBorder">
                                    <!-- Sjx=6  cs参数设定对应  0-自动 1-低速 2-中速 3-高速  -->
                                    <div :class="airSpeed == 0 ? 'item btnHover' : 'item'" @click="airSpeedChange(0)">
                                        <img src="@/assets/images/newIndex/new/4.png" v-if="airSpeed != 0" />
                                        <img src="@/assets/images/newIndex/new/4.1.png" v-if="airSpeed == 0" />
                                        <label>自动</label>
                                    </div>
                                    <div :class="airSpeed == 1 ? 'item btnHover' : 'item'" @click="airSpeedChange(1)">
                                        <img src="@/assets/images/newIndex/new/ss1.png" v-if="airSpeed != 1" />
                                        <img src="@/assets/images/newIndex/new/ss1.1.png" v-if="airSpeed == 1" />
                                        <label>低</label>
                                    </div>
                                    <div :class="airSpeed == 2 ? 'item btnHover' : 'item'" @click="airSpeedChange(2)">
                                        <img src="@/assets/images/newIndex/new/ss2.png" v-if="airSpeed != 2" />
                                        <img src="@/assets/images/newIndex/new/ss2.1.png" v-if="airSpeed == 2" />
                                        <label>中</label>
                                    </div>
                                    <div :class="airSpeed == 3 ? 'item btnHover' : 'item'" @click="airSpeedChange(3)">
                                        <img src="@/assets/images/newIndex/new/ss3.png" v-if="airSpeed != 3" />
                                        <img src="@/assets/images/newIndex/new/ss3.1.png" v-if="airSpeed == 3" />
                                        <label>高</label>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="leftControl">
            <navigation-bar customTitle="空调节能效益分析" style="margin-left: -10px"> </navigation-bar>
            <div class="p50" style="width: 100%; display: flex">
                <div class="control" style="flex-direction: row; width: 100%">
                    <label style="margin-left: 10px">空调品牌：</label>
                    <el-input v-model="ppkt" style="width: 155px" size="mini" />
                    <el-button type="primary" style="margin: 0; background-color: red; border: none" @click="showKTParams = true"
                        >空调参数</el-button
                    >
                    <div style="flex: 1; text-align: right">
                        <span :class="timeType == 'year' ? 'time hover' : 'time'" @click="timeType = 'year'">年</span>
                        <span :class="timeType == 'month' ? 'time hover' : 'time'" @click="timeType = 'month'">月</span>
                        <span :class="timeType == 'day' ? 'time hover' : 'time'" @click="timeType = 'day'">日</span>
                        <DatePicker
                            v-if="timeType == 'year'"
                            type="daterange"
                            v-model="selectedDate"
                            @change="changeDate"
                            placeholder="请选择日期区间"
                            style="width: 220px"
                        />
                        <DatePicker
                            v-if="timeType == 'month'"
                            type="month"
                            v-model="selectedDate"
                            @change="changeDate"
                            placeholder="请选择月份"
                            style="width: 220px"
                        />
                        <DatePicker
                            v-if="timeType == 'day'"
                            type="date"
                            v-model="selectedDate"
                            @change="changeDate"
                            placeholder="请选择日期"
                            style="width: 220px"
                        />
                    </div>
                </div>
            </div>
            <div style="display: flex; gap: 10px">
                <div class="p50">
                    <div class="control">
                        <div class="border">
                            <div class="header">
                                <img src="@/assets/images/airIndex/2.png" />
                                节能量
                                <label style="float: right; margin-right: 10px; color: #767778; font-weight: bold">KW.h</label>
                            </div>
                            <div class="body">
                                <div
                                    style="
                                        height: 32px;
                                        font-size: 30px;
                                        color: #767778;
                                        text-align: right;
                                        padding-right: 20px;
                                        font-weight: bold;
                                    "
                                >
                                    330.33
                                </div>
                            </div>
                        </div>
                        <div class="border">
                            <div class="header">
                                <img src="@/assets/images/airIndex/3.png" />
                                节能率
                            </div>
                            <div class="body">
                                <div
                                    style="
                                        height: 32px;
                                        font-size: 30px;
                                        color: #767778;
                                        text-align: right;
                                        padding-right: 20px;
                                        font-weight: bold;
                                    "
                                >
                                    <!-- <img src="@/assets/images/airIndex/5.png" /> -->
                                    <img src="@/assets/images/1103/约等于.svg" />
                                    28%
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="p50">
                    <div class="control">
                        <div class="border">
                            <div class="header">
                                <img src="@/assets/images/airIndex/4.png" />
                                累计节能量
                                <label style="float: right; margin-right: 10px; color: #767778; font-weight: bold">KW.h</label>
                            </div>
                            <div class="body">
                                <div
                                    style="
                                        height: 32px;
                                        font-size: 30px;
                                        color: #767778;
                                        text-align: right;
                                        padding-right: 20px;
                                        font-weight: bold;
                                    "
                                >
                                    830.38
                                </div>
                            </div>
                        </div>
                        <div class="border">
                            <div class="header">
                                <img src="@/assets/images/airIndex/1.png" />
                                碳排放量
                                <label style="float: right; margin-right: 10px; color: #767778; font-weight: bold">kgCO2e</label>
                            </div>
                            <div class="body">
                                <div
                                    style="
                                        height: 32px;
                                        font-size: 30px;
                                        color: #767778;
                                        text-align: right;
                                        padding-right: 20px;
                                        font-weight: bold;
                                    "
                                >
                                    15.7
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <kongtiaoParams v-if="showKTParams" @close="showKTParams = false"></kongtiaoParams>
        <kongtiaoDetail
            v-if="showKTDetail"
            @dialogClose="showKTDetail = false"
            title="空调温控方案配置详情"
            :wkfaId="wkfa"
            :isFirst="true"
            :deviceInfo="deviceInfo"
        ></kongtiaoDetail>

        <loading :title="loadingTitle" :show="showloading"></loading>
    </div>
</template>

<script>
import navigationBar from '@/components/customComponents/managementCenter/navigationBarCustomTitle'
import kongtiaoParams from './kongtiaoParams'
import kongtiaoDetail from './kongtiaoDetail'
import {AjaxCommon, WriteSetRun} from '@/libs/apiCommon'
import {PopupCommon} from '@/libs/popupCommon'
import loading from '@/components/loading'
import {Utility} from '@/libs/utility'
export default {
    props: ['ktInfo', 'deviceInfo', 'ktClose', 'ktMode'],
    components: {navigationBar, kongtiaoParams, kongtiaoDetail, loading},
    name: 'kongTiaoControl',
    watch: {
        ktInfo: {
            handler(newV) {
                if (typeof newV?.环境温度 != 'undefined') {
                    this.ktDetail = newV
                    // 0 关机  true
                    this.close = newV.开关机 == '0'
                    const mode = parseInt(newV.设定模式)
                    this.mode = mode
                    this.airDic = newV.空调风向
                    this.airSpeed = newV.设定风速
                } else {
                    this.ktDetail = {}
                    this.close = true
                    this.mode = ''
                    this.airDic = ''
                    this.airSpeed = 0
                }
            },
            immediate: true
        },
        ktMode: {
            handler(newV) {
                this.mode = newV.cs
            }
        },
        ktClose: {
            handler(newV) {
                if (typeof newV == 'boolean') {
                    this.close = newV
                }
            }
        }
    },
    data() {
        return {
            ppkt: '',
            showloading: false,
            loadingTitle: '数据处理中，请稍等...',
            /** true 关机 false 开机 */
            close: false,
            ktDetail: {},
            showKTDetail: false,
            showKTParams: false,
            mode: '',
            airDic: 0,
            airSpeed: 0,

            acl: true,

            selectedDate: '',
            timeType: 'year',
            gzl: 1000,
            wkfa: '',
            options: [],
            tempList: [],
            curTemp: 17,
            sdkzRq1: '',
            sdkzRq2: '',
            qkgljc: true
        }
    },
    computed: {},
    created() {
        this.getCurrentPlan()
        this.getTemp()
        this.getPlanList()
    },
    methods: {
        async getCurrentPlan() {
            const res = await AjaxCommon(`/api/TimePlan/GetAirPlan?eq_guid=${this.deviceInfo.id}`, 'get', null)
            this.wkfa = res.data.Message?.[0]?.LIST_GUID || ''
        },
        detailShow() {
            if (this.wkfa.trim() == '') {
                PopupCommon.notify('info', '请选择温控方案')
                return
            }
            this.showKTDetail = true
        },
        sureChange() {
            if (this.wkfa.trim() == '') {
                PopupCommon.notify('info', '请选择温控方案')
                return
            }
            const self = this
            const famc = this.options.find((t) => t.LIST_GUID == this.wkfa)
            const deviceInfo = this.deviceInfo
            // id title  确认XX空调，启用XX方案
            PopupCommon.confirm(`确认${deviceInfo.title}，启用${famc.SCHE_NAME}方案`)
                .then((result) => {
                    if (result) {
                        self.showloading = true
                        AjaxCommon(`/api/TimePlan/SetStrategy`, 'post', {
                            ids: deviceInfo.id,
                            list_guid: this.wkfa
                        })
                            .then((res) => {
                                if (res?.data?.Code == 200) {
                                    PopupCommon.notify('success', '下发成功')
                                } else {
                                    const msg = res?.data?.Message
                                    if (msg) {
                                        PopupCommon.notify('error', msg)
                                    }
                                }
                                self.showloading = false
                            })
                            .catch((res) => {})
                    }
                })
                .catch((err) => {
                    console.log(err)
                })
        },
        changeDate(d) {
            console.log(d)
        },
        async airSpeedChange(index) {
            const self = this
            // 关机
            if (this.close) {
                PopupCommon.notify('info', '请先开机')
                return
            }
            if (this.airSpeed == index) {
                return
            }
            Utility.debounce(async () => {
                const airSpeed = self.airSpeed
                self.airSpeed = index
                const id = self.deviceInfo.id
                /**
                 *Sjx=6  cs参数设定对应  0-自动 1-低速 2-中速 3-高速
                 */
                const data = await AjaxCommon(`/api/Eq/WriteSetRun?eqid=${id}&sjx=6&cs=${index}`, 'post', {})
                if (data?.data?.Message == '1' || data?.data?.Message == 'ok') {
                } else {
                    self.airSpeed = airSpeed
                }
                self.$emit('speed', self.airSpeed)
            })
        },
        async airDicChange(index) {
            const self = this
            // 关机
            if (this.close) {
                PopupCommon.notify('info', '请先开机')
                return
            }
            if (this.airDic == index) {
                return
            }

            Utility.debounce(async () => {
                const airDic = self.airDic
                self.airDic = index
                const id = self.deviceInfo.id
                /**
                 *Sjx=7  cs参数设定对应  0-自动摆风 : 1-手动摆风
                 */
                const data = await AjaxCommon(`/api/Eq/WriteSetRun?eqid=${id}&sjx=7&cs=${index}`, 'post', {})
                if (data?.data?.Message == '1' || data?.data?.Message == 'ok') {
                } else {
                    self.airDic = airDic
                }
            })
        },
        async modeChange(index) {
            const self = this
            // 关机
            if (this.close) {
                PopupCommon.notify('info', '请先开机')
                return
            }
            if (this.mode == index) {
                return
            }
            Utility.debounce(async () => {
                const mode = self.mode
                self.mode = index
                const id = self.deviceInfo.id
                /**
                 * 	cs参数设定对应  0：自动；1，制冷；2，除湿；3，送风；4，制热
                 */
                const data = await AjaxCommon(`/api/Eq/WriteSetRun?eqid=${id}&sjx=4&cs=${index}`, 'post', {})
                if (data?.data?.Message == '1' || data?.data?.Message == 'ok') {
                } else {
                    self.mode = mode
                }
                self.$emit('modeChange', self.mode)
                // 0：自动；1，制冷；2，除湿；3，送风；4，制热
            })
        },
        /** 是否开机 */
        isClose() {
            if (this.close) {
                PopupCommon.notify('info', '请先开机')
                return false
            }
            return true
        },
        async reduce() {
            const self = this
            if (!self.isClose()) {
                return
            }
            //   <!-- 温度设定限制：16-31度 -->
            if (self.ktDetail.设定温度 == 16) {
                return
            }
            self.ktDetail.设定温度--
            Utility.debounce(async () => {
                WriteSetRun(self.deviceInfo.id, 5, self.ktDetail.设定温度)
            })
        },
        async plus() {
            const self = this
            if (!self.isClose()) {
                return
            }
            if (self.ktDetail.设定温度 == 31) {
                return
            }
            self.ktDetail.设定温度++
            Utility.debounce(async () => {
                WriteSetRun(self.deviceInfo.id, 5, self.ktDetail.设定温度)
            })
        },
        changeTemp(e) {
            this.curTemp = e
        },
        getValue(d) {
            if (d == '' || d == 255 || d == null) {
                return '--'
            } else {
                return d
            }
        },
        getPlanList() {
            const params = `/api/TimePlan/GetAirTimePlan`
            AjaxCommon(params, 'get', null).then((res) => {
                if (res?.data?.Code == 200) {
                    const data = res?.data.Message
                    const newData = data.map((t) => {
                        const options = t.OPTIONS?.split('|')
                        t.kqwdzhileng = this.getValue(options?.[2])
                        t.kqwdzhire = this.getValue(options?.[3])
                        t.kjwdzhire = this.getValue(options?.[5])
                        t.kjwdzhileng = this.getValue(options?.[4])
                        t.gjwdzhileng = this.getValue(options?.[6])
                        t.gjwdzhire = this.getValue(options?.[7])
                        t.pdwdxiaji = this.getValue(options?.[9])
                        t.pdwddongji = this.getValue(options?.[10])
                        t.mbwdzxiaji = this.getValue(options?.[11])
                        t.mbwdzdongji = this.getValue(options?.[12])
                        t.lssdsj = this.getValue(options?.[8])

                        // 温度模式开启温度使能   0,关闭；01，开启，控制器默认值为1；不设置传255
                        t.wdmskqwdsn = options?.[13] == 1 ? '开启' : options?.[13] === 0 ? '关闭' : '--'
                        // 1,按天使能；2，按时段使能控制器默认值为1；不设置传255
                        t.wdsnyxfs = options?.[14] == 1 ? '按天使能' : options?.[14] === 2 ? '按时段使能' : '--'
                        // 温度模式开关机控制1,制冷/制热开机控制；2，制冷/制热关机控制；3，制冷/制热开关机控制；默认为2;不设置传255
                        t.wdmskgjkz =
                            options?.[15] == 1
                                ? '制冷/制热开机控制'
                                : options?.[15] === 2
                                ? '制冷/制热关机控制'
                                : options?.[15] === 3
                                ? '制冷/制热开关机控制'
                                : '--'
                        t.zhczr = t.OPER_USER
                        t.czsj = t.OPER_TIME
                        return t
                    })

                    this.options = newData
                } else {
                    PopupCommon.notify('error', res?.data?.msg)
                }
            })
        },
        getTemp() {
            let item = []
            for (let index = 15; index < 40; index++) {
                item.push(index)
            }
            this.tempList = item
        }
    }
}
</script>

<style scoped lang="scss">
.time {
    margin-right: 10px;
    border-bottom: 3px solid #fff;
    cursor: pointer;
    position: relative;
    width: 25px;
    text-align: center;
    padding-bottom: 3px;
    display: inline-block;
    &:hover {
        border-color: #699ff6;
    }
    // &::before {
    //     position: absolute;
    //     content: '';
    //     bottom: 0;
    //     left: 0;
    //     width: 40px;
    //     background: url('@/assets/images/1021/selectBottom.svg') no-repeat;
    // }
}
.hover {
    border-color: #699ff6;
}
.btnHover {
    background-color: #dbe7f5;
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.2);
    label {
        color: #4b78d0;
        font-weight: bold;
    }
}
.kongTiaoControl {
    display: flex;
    gap: 10px;
    padding: 0 10px;
    .leftControl {
        width: calc(50% - 0px);
        display: flex;
        flex-direction: column;
        .p50 {
            width: 100%;
            padding: 0;
            label {
                font-size: 14px;
            }
            .control {
                display: block;
                align-items: center;
                justify-content: center;
                display: flex;
                margin-bottom: 10px;
                flex-direction: column;
                gap: 10px;
                .border {
                    border-top-left-radius: 8px;
                    border-top-right-radius: 8px;
                    border: 1px solid #e0e0e0;
                    width: 100%;
                    text-align: left;
                    .header {
                        img,
                        .icon {
                            margin-top: 4px;
                            float: left;
                            margin-right: 5px;
                        }
                        height: 25px;
                        line-height: 23px;
                        border-bottom: 1px solid #e0e0e0;
                        padding: 0 10px;
                        color: #5795d4;
                        background-color: #f5f7fa;
                        font-size: 14px;
                    }
                    .body {
                        text-align: center;
                        padding: 10px;
                        min-height: 70px;
                        .wdControl {
                            display: inline-block;
                            border: 1px solid #ddd;
                            padding: 4px 10px;
                            font-size: 18px;
                            color: #5795d4;
                            cursor: pointer;
                            height: 40px;
                            line-height: 36px;
                            label {
                                font-size: 18px;
                            }
                        }
                        .wdControl:nth-child(1) {
                            border-top-left-radius: 6px;
                            border-bottom-left-radius: 6px;
                            width: 40px;
                            // background-color: #dbe7f5;
                        }
                        .wdControl:nth-child(3) {
                            border-top-right-radius: 6px;
                            border-bottom-right-radius: 6px;
                            width: 40px;
                            // background-color: #dbe7f5;
                        }
                        .wdControl:nth-child(2) {
                            border-right: none;
                            border-left: none;
                        }
                        .bodyBorder {
                            display: flex;
                            cursor: pointer;
                            .item {
                                flex: 1;
                                display: flex;
                                flex-direction: column;
                                justify-content: center;
                                align-items: center;
                                gap: 0;
                                border: 1px solid #e0e0e0;
                                border-radius: 4px;
                                padding: 0;
                                margin-right: 5px;
                                cursor: pointer;
                                &:hover {
                                    background-color: #dbe7f5;
                                    // box-shadow: 0 1px 6px rgba(0, 0, 0, 0.2);
                                    box-shadow: 0 5px 10px -5px rgba(0, 0, 0, 0.2);
                                    label {
                                        color: #4b78d0;
                                        font-weight: bold;
                                    }
                                }
                            }
                            label {
                                cursor: pointer;
                            }
                            img {
                                width: 16px;
                                cursor: pointer;
                                height: 16px;
                                margin-top: 5px;
                                margin-bottom: 5px;
                            }
                        }
                    }
                }
            }
        }
    }
    .rightControl {
        flex: 1;
        display: flex;
        justify-content: center;
        height: 100%;
        gap: 6px;
        margin-left: 10px;
        flex-direction: column;
        border: 1px solid #e0e0e0;
        padding: 10px;
        border-radius: 4px;
        .item {
            width: 100%;
            height: 32px;
            display: flex;
            align-items: center;
            .sdkz {
                font-size: 14px;
                margin-right: 10px;
            }
            div {
                span {
                    font-size: 14px;
                    color: #666;
                }
            }
        }
    }
}
</style>
